import Vue from "vue";
import VueRouter from "vue-router";
import Home from "./views/Home.vue";
import List from "./views/List.vue";
import ListA from "./views/ListA.vue";
import ListB from "./views/ListB.vue";

Vue.use(VueRouter);

const router = new VueRouter({
  routes: [
    {
      path: "/",
      component: Home,
    },
    {
      path: "/list",
      component: List,
      // redirect: "/list/a", // 重定向配置
      // 配置子路由
      //    子路由匹配的组件会渲染到父路由所指定的路由组件中的坑位（RouterView）里面
      children: [
        {
          path: "",
          // component: ListA,
          redirect: "/list/a",
        },
        {
          // 子路由 path 不要以 / 开头，会自动以 / 拼接父路由的 path
          path: "a",
          component: ListA,
        },
        {
          path: "b",
          component: ListB,
        },
      ],
    },
  ],
});

export default router;
